import React, { memo, useEffect, useState } from 'react'
// import { ftMenuData } from '@/api/modules/home'
import { useAppSelector, useAppDispatch, useAppShallowEqual } from '@/store'
import { fetchMenuData } from '@/store/modules/home'

interface Iprops {
  [key: string]: any
}
const Mine: React.FC<Iprops> = () => {
  const $dispatch = useAppDispatch()
  const { menuData } = useAppSelector(
    (state) => ({
      menuData: state.home.menuData
    }),
    useAppShallowEqual
  )

  useEffect(() => {
    $dispatch(fetchMenuData())
  }, [])
  return (
    <div style={{ display: 'flex', flexWrap: 'wrap' }}>
      {menuData.banner.map((item: any, index: number) => {
        return (
          <div key={index}>
            <img src={item.image} alt="" />
          </div>
        )
      })}
    </div>
  )
}

export default memo(Mine)
